<template>
	<view class="parent-view">
		<view class="banner-view">
			<image class="banner-bg" src="http://c.shiqin.wang/photo/shangc.png" mode="scaleToFill"></image>
			<view class="banner-card-view">
				<swiper  class="sp-card-swiper" :indicator-dots="false"
				 :autoplay="true" :interval="5000" :circular="true":duration="300" :vertical="false">
					<swiper-item v-for="(item,index) in bannerList" :key="index">
						<image class="sp-card-swiper-item" :src="item.url" :data-index="item" @click="bannerClick"/>
					</swiper-item>
				</swiper>
			</view>
		</view>
		<view class="hd-text-view">
			<text class="hd-text">最新活动</text>
			<text class="dingdan-txt" @click="goDingDan">订单</text>
			<image class="dingdan-arrow" src="../../static/right-arrow.png" @click="goDingDan"></image>
		</view>
		<view class="hd-list-view">
			<view class="hd-item" v-for="(item,index) in huodongList" :key="index">
				<image class="hd-img" :src="item.image" :data-index="item" @click="goodsItemlick"></image>
				<view class="hd-txt-view">
					<text class="hd-goods-name" :data-index="item" @click="goodsItemlick">{{item.name}}</text>
					<text class="hd-goods-desc" :data-index="item" @click="goodsItemlick">{{item.sub}}</text>
					<text class="hd-goods-tag" :data-index="item" @click="goodsItemlick">限量500份</text>
					<view class="hd-btn-view">
						<text class="hd-goods-price" :data-index="item" @click="goodsItemlick">{{item.price}}</text>
						<text class="hd-yuan" :data-index="item" @click="goodsItemlick">元</text>
						<text class="hd-btn-buy"  @click="showBuyPop" :data-index="item">立即购买</text>
					</view>
				</view>
			</view>
		</view>
		<view class="rm-txt-view">
			<text class="rm-txt">热卖商品</text>
			<text class="dingdan-txt"  @click="goDingDan">订单</text>
			<image class="dingdan-arrow" src="../../static/right-arrow.png"  @click="goDingDan"></image>
		</view>
		<view class="rm-list-view">
			<view class="rm-item" v-for="(item,index) in remaiList" :key="index"
			 :style="index%2==1?'margin-left: 20px;':'margin-left: 15px;'">
				<image class="rm-img" :src="item.image" :data-index="item" @click="goodsItemlick"></image>
				<text class="rm-goods-name" :data-index="item" @click="goodsItemlick">{{item.name}}</text>
				<text class="rm-goods-desc" :data-index="item" @click="goodsItemlick">{{item.sub}}</text>
				<view class="rm-btn-view">
					<text class="rm-goods-price" :data-index="item" @click="goodsItemlick">{{item.price}}元</text>
					<image class="hd-btn-add" src="../../static/icon_shopping_remai_add.png" @click="showBuyPop" :data-index="item"></image>
				</view>
			</view>
		</view>
		<goodsBuyPop :isShow="isShowGoodsBuyPop" :dataSource="selectGoods"  @returnGoodsBuyPop="goodsBuyPopReturn"/>
	</view>
</template>

<script>
	import goodsBuyPop from "@/components/goods-buy-pop/goods-buy-pop.vue";
	import request from '../index/request.js';
	export default {
		components: {
			goodsBuyPop
		},
		data() {
			return {
				bannerList:[],
				huodongList:[],
				remaiList:[],
				isShowGoodsBuyPop:false,
				selectGoods:{},
			}
		},
		methods: {
			onLoad: function(options) {
				this.appUtil.saveAppInviteId(options)
				this.getData()
				this.getBannerData()
			},
			onShow:function(){
				this.share.url='/pages/tabBar/home/index?appInviteId='+this.appUtil.getAppInviteId()
				this.share.shareType=1
			},
			getData:function(){
				var that=this
				request.post("api/mall/goods_list", {
				}).then(data => {
					for (var i = 0; i < data.length; i++) {
						if(data[i].label==='0'){
							that.huodongList.push(data[i])
						}else if(data[i].label==='1'){
							that.remaiList.push(data[i])
						}
					}
				})
			},
			getBannerData:function(){
				var that=this
				request.post("api/common/getwebset", {
				}).then(data => {
					for (var i = 0; i < data.ShopPic.length; i++) {
						that.bannerList.push(data.ShopPic[i])
					}
				})
			},
			goodsItemlick:function(item) {
				var data=item.currentTarget.dataset.index
				console.log(JSON.stringify(data))
				uni.navigateTo({
					url: '/pages/shopping-goods-detail/index?data='+encodeURIComponent(JSON.stringify(data)),
				})
			},
			showBuyPop:function(item){
				this.selectGoods=item.currentTarget.dataset.index
				this.isShowGoodsBuyPop=true
			},
			goodsBuyPopReturn:function(e){
				this.isShowGoodsBuyPop=e.isclose
				if(e.tag){
					var data=encodeURIComponent(JSON.stringify(e))
					uni.navigateTo({
						url:"../shopping-goods-buy-detail/index?fromData="+data
					})
				}
			},
			goDingDan: function() {
				uni.navigateTo({
					url:"../shopping-goods-order-list/index"
				})
			},
		}
	}
</script>

<style>
	@import "index.css";
</style>
